<template>
  <a-modal
    :title="title"
    width="80%"
    :visible="visible"
    :footer="null"
    :confirmLoading="confirmLoading"
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="关闭"
  >
    <a-card :bordered="false">
      <detail-list title="基本信息">
        <detail-list-item term="标题">{{ model.title }}</detail-list-item>
        <detail-list-item term="使用说明">{{ model.description }}</detail-list-item>
        <detail-list-item term="生效日期类型">{{ this.showDateType() }}</detail-list-item>
        <detail-list-item term="每人限领个数">{{ model.quota }}</detail-list-item>
        <detail-list-item term="领取优惠券的次数">{{ model.statFetchNum==0 ?"无限次数":model.statFetchNum+'次' }}</detail-list-item>
        <detail-list-item term="发行总量">{{ model.total }}</detail-list-item>
        <detail-list-item term="生效开始时间" v-show="model.dateType == 1">{{ model.validStartTime }}</detail-list-item>
        <detail-list-item term="生效结束时间" v-show="model.dateType == 1">{{ model.validEndTime }}</detail-list-item>
        <detail-list-item term="领取日期开始的天数" v-show="model.dateType == 2">{{
          model.fixedStartTerm
        }}</detail-list-item>
        <detail-list-item term="领取日期结束天数" v-show="model.dateType == 2">{{
          model.fixedEndTerm
        }}</detail-list-item>
      </detail-list>
      <a-divider style="margin-bottom: 32px" />
      <detail-list title="折扣信息">
        <detail-list-item term="商店">{{ model.shopName }}</detail-list-item>
        <detail-list-item term="可用范围的类型">{{ this.showRangeType() }}</detail-list-item>
        <detail-list-item term="指定商品">{{ model.goodsName  }}</detail-list-item>
        <detail-list-item term="优惠券类型">{{ model.preferentialType==1?'代金券':'优惠券' }}</detail-list-item>
        <detail-list-item term="多少金额可用">{{ model.priceAvailable/100 +'元' }}</detail-list-item>
        <detail-list-item term="折扣上限" v-show="model.preferentialType == 2">{{ model.discountPriceLimit/100+'元' }}</detail-list-item>
        <detail-list-item term="折扣百分比" v-show="model.preferentialType == 2">{{ model.percentOff +'%'}}</detail-list-item>
        <detail-list-item term="优惠金额" v-show="model.preferentialType == 1">{{ model.priceOff/100+'元' }}</detail-list-item>
      </detail-list>
      <a-divider style="margin-bottom: 32px" />
    </a-card>
  </a-modal>
</template>

<script>
import { getAction } from '@/api/manage'
import pick from 'lodash.pick'
import moment from 'moment'
import DetailList from '@/components/tools/DetailList'
const DetailListItem = DetailList.Item

export default {
  name: 'templateDetails',
  components: {
    DetailList,
    DetailListItem
  },
  data() {
    return {
      visible: false,
      title: '详情',
      model: {},
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },

      confirmLoading: false,
      form: this.$form.createForm(this),
      url: {
        getDetails: '/promotion-api//admins/coupon/template/getById'
      }
    }
  },
  created() {},
  methods: {
    showDateType() {
      if (this.model.dateType == 1) {
        return '固定日期'
      } else {
        return '领取日期'
      }
    },
    showRangeType(){
      if (this.model.preferentialType == 10) {
        return '所有可用'
      } else if(this.model.preferentialType == 20) {
        return '部分商品可用，或指定商品可用'
      }
      else{
        return '部分商品不可用，或指定商品可用'
      }
    },
    show(records) {
      let params = { id: records.id }
      this.visible = true
      this.$nextTick(() => {
        getAction(this.url.getDetails, params).then(res => {
          if (res.success) {
            this.model = res.result
          }
          if (res.code === 510) {
            this.$message.warning(res.message)
          }
        })
      })
    },
    close() {
      this.$emit('close')
      this.visible = false
    },
    handleOk() {
      this.close()
    },
    handleCancel() {
      this.close()
    }
  }
}
</script>

<style lang="less" scoped></style>
